<template>
	<div>
		<!-- 卡片布局 内容部分 -->
		<el-card class="box-card" style="width: 800px; border-radius: 15px;">
			
			<!-- 表格数据 :data ：表数据  border:带有四边框-->
			<el-table :data="adverts" style="font-size: 15px;">
				<!-- prop代表表格当前列的字段名称 -->
				<el-table-column type="index" label="#" width="40">
				</el-table-column>
				<el-table-column prop="initiator" label="发起人" width="100">
				</el-table-column>
				<el-table-column prop="iname" label="项目名称" width="180">
				</el-table-column>
				<el-table-column prop="starttime" label="开启时间" width="120">
				</el-table-column>
				<el-table-column prop="endtime" label="结束时间" width="120">
				</el-table-column>
				<el-table-column prop="statushz" label="是否审核" width="120">
				</el-table-column>

				<el-table-column label="操作" width="220">
					<template slot-scope="scope">
						<el-button type="primary" @click="todelete(scope.row.adid)">删除</el-button>
						<el-button type="primary" @click="toadd">添加广告</el-button>
					</template>
				</el-table-column>


			</el-table>
			<el-dialog title="添加用户信息" :visible.sync="addDialogFormVisible" width="50%" :before-close="reset">
				<el-form style="margin-left: 50px;" :model="advert" ref="addAdvertref" label-width="80px">
					<el-form-item label="发起人" prop="initiator">
						<el-input style="margin-left: 30px;" v-model="advert.initiator"></el-input>
					</el-form-item>


					<el-form-item label="项目名称" prop="iid">
						<template>
							<el-select v-model="advert.iid" placeholder="请选择">
								<el-option v-for="item in options" :key="item.iid" :label="item.iname"
									:value="item.iid">
								</el-option>
							</el-select>
						</template>

					</el-form-item>


				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="reset">取 消</el-button>
					<el-button type="primary" :visible.sync="addDialogFormVisible" @click="addAdvertform">确 定
					</el-button>
				</div>
			</el-dialog>
			<!-- 分页 -->
			<el-pagination
			  @size-change="handleSizeChange"
			  @current-change="handleCurrentChange"
			  :current-page="queryinfo.pagenum"
			  :page-sizes="[1, 3, 5, 10]"
			  :page-size="queryinfo.pagesize"
			  layout="total, sizes, prev, pager, next, jumper"
			  :total="total"
			>
			</el-pagination>
		</el-card>
	</div>
</template>

<script>
	import qs from 'qs'
	export default {
		data() {
			return {
				queryinfo: {
					pagenum: 1,
					pagesize: 3
				},
				adverts: [], //用来保存查询到的所有用户信息
				total: 0,
				advert: {
					initiator: '',
					iid: ''
				},
				addDialogFormVisible: false,
				options: [],
				value: '',

			}
		},
		methods: {
			handleSizeChange(newpagesize) {
			    this.queryinfo.pagesize = newpagesize;
				this.selectAdvert();
			  },
			  handleCurrentChange(newpagenum) {
			    this.queryinfo.pagenum = newpagenum;
				this.selectAdvert();
			  },
			
			//查询所有数据
			async selectAdvert() {
				this.adverts = [];
				var res = await this.$http.post("selectByStatus", qs.stringify(this.queryinfo))
				// console.log(res)
				if (res.data.code == 200) {
					this.adverts = res.data.data.list
					this.total = res.data.data.total
					console.log(this.total)
				} else {
					this.$message.info(res.data.data.message)
				}

			},

			//查询项目表
			async selectAllItem() {
				//this.options = [];
				var id = window.sessionStorage.getItem("userid")
				var res = await this.$http.post("selectItemByUserId?userid=" + id)
				// console.log(ires)
				//console.log(res)
				if (res.data.code == 200) {
					//console.log(res.data.data)
					this.options = res.data.data
				} else {
					this.$message.info(res.data.data.message)
				}
			},
			//添加
			addAdvertform() {
				this.$refs.addAdvertref.validate(async (val) => {
					if (val) {
						var str = qs.stringify(this.addAdvert)
						var res = await this.$http.post("insertAdvert", qs.stringify(this.advert))
						if (res.data.code == 200) {
							this.$message.success(res.data.message)
							this.selectAdvert()
						} else {
							this.$message.error(res.data.message)
						}
						this.fileList = []
						this.reset()
					} else {
						this.$message.error("数据不合法，请检查")
					}
				})
			},
			async todelete(adid) {
				var res = await this.$http.post('deletetAdvert?adid='+adid)
				if(res.data.code==200){
					this.$message.success(res.data.message)
				}else{
					this.$message.error(res.data.message)
				}
				this.queryinfo.pagenum=1
				this.selectAdvert()
			},
			toadd() {
				this.selectAllItem()
				this.addDialogFormVisible = true
			},
			reset() {
				this.addDialogFormVisible = false
				this.$refs.addAdvertref.resetFields()
			}
		},
		// 当页面加载后，调用其钩子函数来链接后端接口获取数据
		mounted() {
			this.selectAdvert();
		}
	}
</script>

<style scoped="scoped">
	.fqgg{
		text-align: left;
	}
</style>
